<template>
  <div>
    <el-input 
      v-if="dataType === 'string'" 
      v-model="inputValue" 
      :placeholder="placeholder" 
      :maxlength="100" 
    />
    <el-input-number 
      :step="1"
      v-else-if="dataType === 'int'"  
      v-model="inputValue"
      :placeholder="placeholder"
    />

    <el-radio-group v-model="inputValue"  v-else-if="dataType === 'boolean'"  >
        <el-radio :label="'true'">是</el-radio>
        <el-radio :label="'false'">否</el-radio>
    
    </el-radio-group>

  <el-input-number 
      :step="1"
      v-else-if="dataType === 'float'"  
      v-model="inputValue"
      :placeholder="placeholder"
    />
    <el-upload
      :action="AttachUtil.getUploadOneUrl()"
      v-else-if="dataType === 'image'"
      :show-file-list="false"
      :auto-upload="true"
      :on-success="handleFileSuccess"
      :data="params"
    >
    <img height="30px" width="30px" :src="AttachUtil.getFilePreview(modelValue)" />
    <el-button size="small" type="primary">点击上传</el-button>
    </el-upload>

    <el-input 
      v-else
      v-model="inputValue" 
      :placeholder="placeholder" 
      :maxlength="100" 
    />
  </div>
</template>

<script setup lang="ts">
import { defineProps, defineEmits, computed } from "vue";
import AttachUtil from "@/utils/attachUtil";

const props = defineProps({
  modelValue: {
    type: [String],
    default: ''
  },
  businessId: {
    type: [String, Number],
    default: ''
  },
  dataType: {
    type: String,
    default: 'string'
  },
  placeholder: {
    type: String,
    default: '请输入'
  }
});

const params = reactive({
  businessType: "systemConfig",
  businessId: props.businessId
});



const emit = defineEmits(['update:modelValue']);

// 处理字符串输入
const inputValue = computed({
  get: () => props.modelValue.toString(),
  set: (value) => emit('update:modelValue', value)
});


// 处理文件上传
const handleFileSuccess = (file: any) => {
  emit('update:modelValue', file.data.id);
};
</script>